import 'package:flutter/material.dart';
import 'package:flutter_jd/ui/widgets/kit.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class ShareSheet extends StatefulWidget {
  final Function? onTap;

  ShareSheet({Key? key, this.onTap}) : super(key: key);

  @override
  State<StatefulWidget> createState() => MyState();
}

class MyState extends State<ShareSheet> {
  List shareList = [
    {'name': '微信好友', 'icon': 0xe63b, 'color': 0XFF3BBB07, 'onTap': () => {}},
    {'name': '朋友圈', 'icon': 0xe630, 'color': 0XFF9FCE18, 'onTap': () => {}},
    {'name': 'QQ好友', 'icon': 0xe631, 'color': 0XFF3BAFFC, 'onTap': () => {}},
    {'name': 'QQ空间', 'icon': 0xe615, 'color': 0XFFFCCC54, 'onTap': () => {}},
    {'name': '微博', 'icon': 0xe641, 'color': 0xFFF75669, 'onTap': () => {}},
    {'name': '更多', 'icon': 0xe6d3, 'color': 0xFFCCCCCC, 'onTap': () => {}},
  ];

  List outerList = [
    {'name': '收藏', 'icon': 0xe8ab, 'onTap': () => {}},
    {'name': '复制链接', 'icon': 0xe61a, 'onTap': () => {}},
    {'name': '分享海报', 'icon': 0xe8c6, 'onTap': () => {}},
    {'name': '举报', 'icon': 0xe8c3, 'onTap': () => {}},
  ];

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 330.h,
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.only(top: 15.h),
            child: Text(
              '分享至',
              style: TextStyle(
                fontSize: 14.sp,
              ),
            ),
          ),
          Container(
            height: 100.h,
            margin: EdgeInsets.only(top: 10.h),
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: List.generate(
                shareList.length,
                (index) {
                  Map item = shareList[index];
                  return buildBottomSheetItem(
                    item['name'],
                    item['icon'],
                    Color(item['color']),
                    iconColor: Colors.white,
                    onTap: item['onTap'],
                  );
                },
              ),
            ),
          ),
          Container(
            height: 90.h,
            margin: EdgeInsets.only(bottom: 15.h),
            child: ListView(
              scrollDirection: Axis.horizontal,
              children: List.generate(outerList.length, (index) {
                Map item = outerList[index];
                return buildBottomSheetItem(
                  item['name'],
                  item['icon'],
                  Color(0xFFF1F1F1),
                  iconColor: Color(0xFFA0A3A6),
                  onTap: item['onTap'],
                );
              }),
            ),
          ),
          //取消按钮
          InkWell(
            onTap: () {
              Navigator.of(context).pop();
            },
            child: Container(
              child: Text(
                "取消",
                style: TextStyle(
                  fontSize: 14.sp,
                ),
              ),
              height: 55.h,
              alignment: Alignment.center,
              decoration: BoxDecoration(
                border: Border(
                  top: BorderSide(
                    color: Color(0xFFF5F5F5),
                    width: 1.w,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget buildBottomSheetItem(
    String title,
    int icon,
    Color backgroundColor, {
    Function? onTap,
    Color iconColor = Colors.white,
  }) {
    return GestureDetector(
      onTap: () {
        if (onTap != null) {
          onTap();
        }
      },
      child: Container(
        margin: EdgeInsets.only(left: 15.w, right: 11.w),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              width: 50.r,
              height: 50.r,
              decoration: BoxDecoration(
                color: backgroundColor,
                borderRadius: BorderRadius.circular(50.r),
              ),
              child: Kit.iconFont(icon, iconColor, 26.sp),
            ),
            Container(
              margin: EdgeInsets.only(top: 10.h),
              child: Text(
                title,
                style: TextStyle(
                  fontSize: 12.5.sp,
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}
